@charset "utf-8";
/*
 * ==============================
 * @description: [WebSite] 公共样式模块
 * @author: ---
 * @update: ---
 * ==============================
*/
/* 顶部快捷导航 start */
@border_color:#ccc;
@color:#c81623;

header{
    position: relative;
}
.order-search{
    position:absolute;
    right:0;
    top:25px;
    input{
        width:455px;
        height:36px;
        text-indent: 10px;
        border:2px solid @color;
        font-size: 16px;
    }
    .order-btn{
        width:80px;
        height:36px;
        line-height: 36px;
        text-align: center;
        border:2px solid @color;
        background-color: @color;
        font-size: 16px;
        color:#fff;
    }
}
/* 购物车开始 */
.cart{

}
.cart-bar{
    margin-bottom:20px;
    height:36px;
    font-size:16px;
    color:@color;
}

.cart-main{

    /* 购物车头部 */
    .cart-th{
        border:1px solid #ddd;
        background-color: #f5f5f5;
        margin-bottom: 10px;
        overflow: hidden;
    }
    .th{
        float:left;
        line-height: 36px;
    }
    .th-checkAll{
        display:flex;  
        align-items: center;
        padding-left:10px;
        width:80px;
        input{
            margin-top:-3px;
        }
    }
    .th-item{
        width:500px;
        text-align: center;
    }
    .th-inner{
        margin-left:34px;
        width:120px;
    }
}
.cart-tb{
    margin-top:20px;
    .cart-tb-bar{
        border-bottom:2px solid #ccc;
        line-height: 36px;
    }
    .cart-tb-barr{
        padding-left:20px;
        font-size: 16px;
        font-weight: 700;
        input{
            margin-right:10px;
        }
    }
    .tb-check{
        display:flex;  
        align-items: center;
        input{
            margin:0 10px;
        }
       .tb-ch-sp{
           display:inline-block;
           width:54px;
           line-height:18px;
           text-align: center;
           background-color:@color;
           color:#fff;
       }
    }
    .freight-owe{
        color:@color;
    }
}

.cart-tb-con{
    margin:20px 0;
    border:1px solid #ddd;
    .tb-con-item{
        position: relative;
        padding:10px 5px;
        border-bottom:1px solid #ddd;
        color:#333;
        li{
            float:left;
        }
        &.flag-top{
            padding:50px 5px 50px 5px;
        }
        &:last-child{
            border-bottom:none;
        }
    }
    .tb-con-check{
        width:125px;
        input{
            position: absolute;
            top:10px;
            left:10px;
            &.flag-top{
                top:50px;
            }
        }
        img{
            margin-left:36px;
            border:1px solid #ddd;
        }
    }
    .tb-con-info{
        margin-left:10px;
        width:200px;
        line-height:18px;
        .tbcon-gift{
            color:#999;
            i{
                display: inline-block;
                margin-right:5px;
                width:17px;
                height:17px;
                line-height: 17px;
                background-color:@color;
                text-align: center;
                color:#fff;
            }
        }
    }
    .tb-con-size{
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        width:245px;
        padding:0 40px;
    }
    .tb-con-inner{
        margin-left:30px;
        width:120px;
        &.flag-top{
            position: relative;
            top:-40px;
        }
    }
    .tb-con-btn{
        position: relative;
        input{
            float:left;
            margin:0;
            padding:0;
            width:30px;
            height:30px;
            border:1px solid #ddd;
            border-radius: 0;
            background-color: #fff;
        }
        .tb-btn-num{
            border-right:none;
            border-left:none;
        }
        p{
            position: absolute;
            top:35px;
            left:33px;
            color:#999;
        }
    }
    .tb-con-top{
        position: absolute;
        top:10px;
        left:5px;
        width:500px;
        .contop-title{
            display: inline-block;
            margin-right:10px;
            width:46px;
            height:20px;
            line-height: 20px;
            border:1px solid @color;
            text-align: center;
            color: @color;
        }
        .contop-check{
            display: inline-block;
            margin:0 5px 0 10px;
            width:70px;
            height:20px;
            line-height: 20px;
            background-color:@color;;
            text-align: center;
            color:#fff;
        }
    }
    .tn-con-free{
        position: absolute;
        bottom:0;
        left:80px;
        color:#999;
        .free-info{
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
            float:left;
            width:250px;
        }
        .free-num{
            margin-left:30px;
        }
    }
}
.cart-tbt{
    width: 100%;
    height:52px;
    overflow: hidden;
    border:1px solid #ddd;
    line-height:52px;
    li{
        float:left;
        margin-right:10px;
        cursor: pointer;
        input{
            display:block;
            margin:19px 0 0 5px;
        }
    }
}
.cart-tf-info{
    text-align: right;
    .tf-info-pr{
        padding:8px 20px 0 0;
        line-height: 20px;
        .price{
            font-size: 16px;
            font-weight: 700;
            color:@color;
        }
        p{
            padding-right:30px;
        }
    }
    .tf-btn{
        display: block;
        margin-top:-1px;
        width:109px;
        height:52px;
        background-color: @color;
        border:none;
        font-size: 16px;
        color:#fff;
    }
}

.del-ps{
    margin:20px 0;
}
.del-info{
    padding:0 10px;
    height: 32px;
    line-height: 32px;
    background: #fffdee;
    color:#999;
    li{
        float:left;
    }
    .info-name{
        margin-right:350px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        width:200px;
    }
    .info-pr{
        width:200px;
        text-align: center;
    }
    .info-num{
        .info-pr;
    }
    .info-re{
        width:100px;
        text-align: right;
    }
    .info-mo{
        width:100px;
        text-align: center;
    }
}
/* 猜你喜欢 */
.like-hd{
    margin:15px 0;
    height:41px;
    line-height: 41px;
    border:1px solid #ddd;
    background-color: #f5f5f5;
    font-size: 14px;
    li{
        float:left;
        width:87px;
        height:39px;
        text-align: center;
        &.current{
            background-color:@color;
            color:#fff;
        }
    }
}
.like-bd{
    position: relative;
    height:313px;
    margin-bottom:20px;
    .pr-next,.pr-prev{
        position: absolute;
        top:50%;
        margin-top:-16px;
    }
    .pr-next{
        right:0;
    }
    .pr-prev{
        left:0;
    }
    .likebd-info{
        overflow: hidden;
        margin:0 auto;
        width:996px;
        height:310px;
        border:1px dashed #ccc;
        li{
            float:left;
            padding:15px 15px;
            display: flex;
            flex-flow:column;
            width:248px;
            height:310px;
            text-align: center;
            border-right:1px dashed #ccc;
            color:#333;
            &:last-child{
                border-right:none;
            }
            img{
                height:100%;
                flex-shrink: 0;
            }
        }
        .like-name{
            text-align: left;
        }
        .like-price{
            display: block;
            margin:10px 0;
            font-size:14px;
            color:@color;
        }
        .like-btn{
            display: block;
            margin:0 auto;
            width: 120px;
            height: 28px;
            line-height:28px;
            border:1px solid #999;
            i{
                margin-right:5px;
            }
        }
    }
}